<include file='./header' />
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<script type="text/javascript" src="__ROOT__/js/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript">
$(function() {
    pagebinding();  
})



function pagebinding(){
        $.ajax({  
        type: "post",  
        url: "__URL__/pagebinding",
        dataType: 'json',
        data: {},  
        beforeSend: function(XMLHttpRequest){
        },  
        success: function(json){
            if(json != null){
                $("#txtnickname").val(json[0].nickname);
                $("input[name='radiosex'][value='"+ json[0].sex +"']").prop("checked",true);
                $("#txtbirthday").val(json[0].birthday);
                $("#selprovince").val(json[0].provinceid);
                $("#selcity").val(json[0].cityid);
                $("#selarea").val(json[0].areaid);
                $("input[name='radiomarital'][value='"+ json[0].marital +"']").prop("checked",true);
                $("#selprofession").val(json[0].profession);
                $("#selincome").val(json[0].income);
                //$("#imghead").attr('src',json[0].head);
            }
        } 
    })
    
    $("#selprovince").change(function() { 
        getprovince();
    });
    
    $("#selcity").change(function() { 
        getcity();
    });
    
    $("#selarea").change(function() { 
        getarea();
    });
}

function getprovince(){
    var pid = $("#selprovince").val();
    if(pid != "-1"){
        $.ajax({  
            type: "post",  
            async:false,
            url: "__URL__/getCityInfo1",
            dataType: 'json',
            data: {pid:pid},  
            beforeSend: function(XMLHttpRequest){
            },  
            success: function(json){
                $("#selcity").empty();
                $("#selarea").empty()
                var a = "<option value='-1'>--请选择--</option>";
                $("#selarea").append(a);
                
                var count = json.length;
                var i = 0;
                var b="<option value='-1'>--请选择--</option>";
                for(i=0;i<count;i++){
                    b+="<option value='"+json[i].cityID+"'>"+json[i].city+"</option>";
                }
                $("#selcity").append(b);
            } 
        })
    }else{
        $("#selcity").empty();
        var a = "<option value='-1'>--请选择--</option>";
        $("#selcity").append(a);
        $("#selarea").empty();
        a = "<option value='-1'>--请选择--</option>";
        $("#selarea").append(a);
    }
}

function getcity(){
    var cid = $("#selcity").val();
    if(cid != "-1"){
        $.ajax({  
            type: "post", 
            async:false,
            url: "__URL__/getAreaInfo1",
            dataType: 'json',
            data: {cid:cid},  
            beforeSend: function(XMLHttpRequest){
            },  
            success: function(json){
                $("#selarea").empty();
                var count = json.length;
                var i = 0;
                var b="<option value='-1'>--请选择--</option>";
                for(i=0;i<count;i++){
                    b+="<option value='"+json[i].areaID+"'>"+json[i].area+"</option>";
                }
                $("#selarea").append(b);
            } 
        })
    }
}

//上传头像
function previewImage(file)
{
  var MAXWIDTH ;
  var MAXHEIGHT;
  var div = document.getElementById('preview');
  $("#hidimgurl").val(file.value);
  if (file.files && file.files[0])
  {
    div.innerHTML = '<img id=imghead>';
    var img = document.getElementById('imghead');
    img.onload = function(){
      var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
      img.width = rect.width;
      img.height = rect.height;
      img.style.marginLeft = rect.left+'px';
      img.style.marginTop = rect.top+'px';
    }
    var reader = new FileReader();
    reader.onload = function(evt){img.src = evt.target.result;}
    reader.readAsDataURL(file.files[0]);
  }
  else
  {
    var sFilter='filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src="';
    file.select();
    var src = document.selection.createRange().text;
    div.innerHTML = '<img id=imghead>';
    var img = document.getElementById('imghead');
    img.filters.item('DXImageTransform.Microsoft.AlphaImageLoader').src = src;
    var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
    status =('rect:'+rect.top+','+rect.left+','+rect.width+','+rect.height);
    div.innerHTML = "<div id=divhead style='width:"+rect.width+"px;height:"+rect.height+"px;margin-top:"+rect.top+"px;margin-left:"+rect.left+"px;"+sFilter+src+"\"'></div>";
  }
}
function clacImgZoomParam( maxWidth, maxHeight, width, height ){
    var param = {top:0, left:0, width:width, height:height};
    if( width>maxWidth || height>maxHeight )
    {
        rateWidth = width / maxWidth;
        rateHeight = height / maxHeight;
        
        if( rateWidth > rateHeight )
        {
            param.width =  maxWidth;
            param.height = Math.round(height / rateWidth);
        }else
        {
            param.width = Math.round(width / rateHeight);
            param.height = maxHeight;
        }
    }
    
    param.left = Math.round((maxWidth - param.width) / 2);
    param.top = Math.round((maxHeight - param.height) / 2);
    return param;
}
</script> 
</head>
<body>
<!--顶部开始-->
<include file="./top" />
<!--顶部结束-->
<!--左导航开始-->
<include file="./left" />
<!--左导航结束-->
<form action="__URL__/updateUser" method="post" enctype="multipart/form-data"> 
 <input id="hidimgurl" name="hidimgurl" type="hidden" />  
<!--主体开始-->
<div class="main-content">
	<div class="wrapper">
		<div class="panel">
            <div class="panel-head">
                个人信息
            </div>
            <div class="panel-body">               
				<div class="left left25 align-center">
                    <div id="preview" class="user_img align-center">
                        <img id="imghead" name ="imghead" src="__ROOT__/<?php echo $_SESSION['userhead'];?>">
                    </div>
                    <div class="blank10"></div>
                    <input type="file" onChange="previewImage(this)" id="filehead" name="filehead" class="hide" />
    				<a href="javascript:void(0)" onClick="$('#filehead').click()" class="btn btn-danger">选择图片</a>
                </div>
                <div class="right right75 user_detail">
                    <ul>
                        <li>
                        	<label>昵　称</label>
                            <span><input name="txtnickname" type="text" class="form-control" value="" id="txtnickname" name="txtnickname"></span>
                        </li>
                        <li>
                        	<label>性　别</label>
                            <span><input name="radiosex" type="radio" value="1">男<input name="radiosex" type="radio" value="2">女</span>
                        </li>
                        <li>
                        	<label>生　日</label>
                            <span><input name="txtbirthday" type="text" class="form-control Wdate" onFocus="WdatePicker()" value="" id="txtbirthday"></span>
                        </li>
                        <li>
                        	<label>省份城市</label>
                            <span>
                                <select class="form-control" name="selprovince" id="selprovince">
                                   <option value="-1">--请选择--</option>
                                   <?php foreach ($provincelist as $k => $v):?>
                                        <option value="{$v['provinceID']}" >{$v['province']}</option> 
                                   <?php endforeach?>
                                </select>
                                <select class="form-control" name="selcity" id="selcity">
                                	<option value="-1">--请选择--</option>
                                   <?php foreach ($citylist as $k => $v):?>
                                      <option value="{$v['cityID']}">{$v['city']}</option>
                                   <?php endforeach?>
                                </select>
                                <select class="form-control" name="selarea" id="selarea">
                                	<option value="-1">--请选择--</option>
                                    <?php foreach ($arealist as $k => $v):?>
                                      <option value="{$v['areaID']}">{$v['area']}</option>
                                   <?php endforeach?>
                                </select>
                            </span>
                        </li>
                        <li>
                            <label>婚　否</label>
                            <span><input name="radiomarital" type="radio" value="0">未婚<input name="radiomarital" type="radio" value="1">已婚</span>
                        </li>
                        <li>
                            <label>工作状况</label>
                            <span>
                                <select class="form-control" name="selprofession" id="selprofession">
                                    <option value="-1">--请选择--</option>
                                    <option value="1">学生</option>
                                    <option value="2">老板</option>
                                    <option value="3">职员</option>
                                    <option value="4">公务员</option>
                                </select>
                            </span>
                        </li>
                        <li>
                            <label>收入水平</label>
                            <span>
                                <select class="form-control" name="selincome" id="selincome">
                                    <option value="-1">--请选择--</option>
                                    <option value="1">月收入2000以内</option>
                                    <option value="2">月收入2000~5000</option>
                                    <option value="3">月收入5000~10000</option>
                                    <option value="4">月收入10000~20000</option>
                                    <option value="5">月收入20000以上</option>
                                </select>
                            </span>
                        </li>
                        <li>
                            <span><input name="" type="submit" class="btn btn-danger" value="保 存" /></span>
                        </li>
                    </ul>
                </div>
                <div class="clear"></div>
                
          </div>
        </div>
    </div>
</div>
<!--主体结束-->
</form>
<!--底部开始-->
<include file="./foot" />
<!--底部结束-->
</body>
</html>
